<template>
  <div class="index">
  	<div class="relative">
	    	<img src="../../../../static/img/index/banner.png" alt=""  class="w100 vermiddle"/>
		    <div class="bannerWrapper">
		    	<div class="content">
		    		<div class="fs40 sclight line1">一键注册，轻松查辨极限词</div>
		    		<div class="fs30 sclight line1 mt25">由阿里云官方数据提供</div>
		    		<div class="more mt45 fs16" @click="goCheck('textCheck')">
		    			我要查询
		    		</div>
		    	</div>
		    </div>
    </div>
    <div class="content1Wrapper">
    	<div class="checkChange wpx1200 clearFix">
					<ul>
						<li class="wengao" @click="goCheck('textCheck')">
							<p class="title scbold">灵辨文稿</p>
							<p class="scregular">文本扫描，披露到词</p>
						</li>
						<li class="lianjie" @click="goCheck('imgCheck')">
							<p class="title scbold">灵辨图片</p>
							<p class="scregular">智能框选，无处隐藏</p>
						</li>
						<li class="tuxiang scbold" @click="goCheck('urlCheck')">
							<p class="title">灵辨网页</p>
							<p class="scregular">一键粘贴，省心省力</p>
						</li>
						<li class="dianpu scbold">
							<p class="title">更多功能</p>
							<p class="scregular">Coming soon...</p>
						</li>
					</ul>
				</div>
    </div>
    <div class="content2Wrapper">
    	<div class="wpx1200">
    		<h3 class="fs28 pt55 mb0 mt0 line1 scbold">权威极限词系统，助力您规避风险</h3>
    		<div class="fs14 mt15 line1">由阿里云官方数据库提供的强大广告违禁词检测系统，助力商家规避投诉风险，为您的线上店铺保驾护航~</div>
    		<div class="clearFix mt60">
    			<dl v-for="(item,index) in dls">
    				<dt>
    					<img :src="item.url" alt="" class="vermiddle" height="68"/>
    				</dt>
    				<dd class="line1 mt30 fs16">{{item.name}}</dd>
    			</dl>
    		</div>
    	</div>
    </div>
    <div class="content3Wrapper">
    	<div class="wpx1200">
    		<h3 class="fs28 mt0 mb0 line1 pt15 scbold">合作伙伴及客户</h3>
    		<div class="mt75">
    			<img v-for="item in huoban" :src="item" alt=""  class="ml30 mr30"/>
    		</div>
    	</div>
    </div>
    <div class="content4Wrapper w100 relative">
    	<img src="../../../../static/img/index/bg.png" alt="" class="vermiddle w100" height="150"/>
    	<div class="bottomBanner">
    		<h3 class="fs24 mb25 line1">更权威的极限词监测系统</h3>
    		<div class="more1" @click="goCheck('textCheck')">
    			注册体验
    		</div>
    	</div>
    </div>
  </div>
</template>

<script>
	import MsgBus from '@/components/bus.js';
	import API from "@/api"
export default {
  name: 'index',
  data () {
    return {
    		dls:[
	    		{name:"海量词库实时更新",url:"../../../../static/img/index/icon-1.png"},
	    		{name:"未上架的也能监测",url:"../../../../static/img/index/icon-2.png"},
	    		{name:"结果详实披露到词",url:"../../../../static/img/index/icon-3.png"},
	    		{name:"导出结果自主分析",url:"../../../../static/img/index/icon-4.png"},
	    		{name:"多个平台通通支持",url:"../../../../static/img/index/icon-5.png"},
	    		{name:"图片文字智能识别",url:"../../../../static/img/index/icon-6.png"},
	    		{name:"定位原因方便查看",url:"../../../../static/img/index/icon-7.png"},
	    		{name:"权威出品安全保护",url:"../../../../static/img/index/icon-8.png"}
	    		],
	    	huoban:[
	    		"../../../../static/img/index/aliyun.png",
	    		"../../../../static/img/index/tmall.png",
	    		"../../../../static/img/index/taobao.png",
	    		"../../../../static/img/index/baidu.png",
	    		"../../../../static/img/index/gridsum.png",
	    	]
    }
  },
  mounted: function () {
	
  },
  methods:{
		goCheck(type){
			if(type=="textCheck"){
				sessionStorage.setItem("checkType","文字检测");
			}else if(type=="imgCheck"){
				sessionStorage.setItem("checkType","图片检测");
			}else if(type=="urlCheck"){
				sessionStorage.setItem("checkType","网站检测");
			}
			if(API.header.getCookie("token")){
				this.$router.push({
		      name: type,
		    })
			}else{
				MsgBus.$emit('loginEvent',type)
//				this.$message.warning("请先登录");
			}
		}
	}
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
	@import "index.css";
</style>
